<template>
	<view v-if='records && records.length > 0'>
		<view v-for='record in records'>
			<view class='list'>
				<view class='data'>
					报名活动:{{record.activity.__metadata.title}}
				</view>
				<view class='data'>
					开始时间:{{$u.timeFormat(new Date(record.activity.__metadata.startTime), 'yyyy年mm月dd日')}}
				</view>
				<view class='data'>
					报名时间:{{$u.timeFormat(new Date(record.activity.__metadata.createdTime), 'yyyy年mm月dd日')}}
				</view>
				<view class='data'>
					姓名:{{record.name}}
				</view>
				<view class='data'>
					电话:{{record.mobile}}
				</view>
				<view class='data'>
					身份证:{{record.description}}
				</view>
				<view class='data'>
					报名结果:
					<text v-if='record.status == 0' style='color:#fa3534'>未支付报名费</text>
					<text v-if='record.status == -2' style='color:#909399'>已取消</text>
					<text v-if='record.status == 1' style='color:#19be6b'>报名成功</text>
				</view>
				<view v-if='record.invoice.__metadata.status == 0 && record.status == 0' style='padding-top:10px'>
					<u-row>
						<u-col span='6'>
							<view style='padding-right:7px'>
								<u-button type='warning' text='取消报名' @click='cancel(record.id)' :plain='true' shape='circle'></u-button>
							</view>
						</u-col>
						<u-col span='6'>
							<view style='padding-left:7px'>
								<u-button type='success' text='支付报名费' @click='pay(record.invoice.id)' :plain='true' shape='circle'></u-button>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
		</view>
	</view>
	<view v-else style='padding-top:30vh'>
		<u-empty mode="favor" text='暂无报名记录'>
		</u-empty>
	</view>
</template>

<script>
	import wechatPay from '@/utils/wechat-pay.js'
	export default {
		data() {
			return {
				records: []
			}
		},
		onLoad() {

		},
		onShow() {
			let api_token = uni.getStorageSync('api_token')
			if (api_token != '') {
				this.getRecord()
			} else {
				uni.showModal({
					title: '',
					content: '请先登录！',
					showCancel: false,
					success: () => {
						uni.navigateTo({
							url: '/pages/index/login'
						})
					}
				})
			}
		},
		methods: {
			getRecord(){
				this.request.get(`api/activity-records`, {
					'@expands': "['entity.activity','entity.invoice']",
					'@order': `entity.id|DESC`
				}).then((res) => {
					this.records = res.data
				})
			},
			cancel(id){
				uni.showModal({
					title: '',
					content: '是否确定取消报名？',
					success: (data) => {
						if(data.confirm){
							this.request.put(`api/activity-records/${id}`,{status : '-2'}).then((res) => {
								this.getRecord()
								uni.showModal({
									title: '',
									content: '取消成功！',
									showCancel: false,
									success: () => {
										
									}
								})
							})
						}
					}
				})
			},
			pay(invoice){
				uni.navigateTo({
					url: `/pages/payment/pay-code?invoice=${invoice}`
				})
				// wechatPay(invoiceId).then((res) => {
				// 	uni.hideLoading()
				// 	uni.showModal({
				// 		title: '',
				// 		content: '支付成功！',
				// 		showCancel: false,
				// 		success: () => {
				// 			this.getRecord()
				// 		}
				// 	})
				// }).catch((err) => {
				// 	uni.hideLoading()
				// 	uni.showModal({
				// 		title: '',
				// 		content: '支付失败，请重试',
				// 		showCancel: false,
				// 		success: () => {
				// 			this.getRecord()
				// 		}
				// 	})
				// })
			}
		}
	}
</script>

<style>
	.list{
		background-color: #f3f3f3;
		margin:10px;
		padding:10px;
		border-radius: 5px;
	}
	
	.data{
		padding: 4px 0px;
		color:#909399;
	}
</style>